import React from 'react'
import {
    Form,
    Input,
    Button,
    Dialog,
    TextArea,
    DatePicker,
    Selector,
    Slider,
    Stepper,
    Switch,
} from 'antd-mobile'
function Index() {
    // const onFinish = (values: any) => {
    //     Dialog.alert({
    //       content: <pre>{JSON.stringify(values, null, 2)}</pre>,
    //     })
    //   }
    return (
        <div>
            {/* 登录表单 */}
            <Form
                layout='horizontal'
                footer={
                    <Button block type='submit' color='primary' size='large'>
                        提交
                    </Button>
                }
            >
                <Form.Item
                    name='phone'
                    label='账号'
                    rules={[{ required: true, message: '账号不能为空' },
                    {
                        pattern: /^1[3-9]\d{9}$/, message: '账号名为手机号'
                    }
                    ]}
                >
                    <Input onChange={console.log} placeholder='请输入账号' />
                </Form.Item>
                <Form.Item
                    name='password'
                    label='密码'
                    rules={[{ required: true, message: '密码不能为空' },
                    {
                        pattern: /\w[6,12]/, message: '密码为6-12位数字字母'
                    }
                    ]}
                >
                    <Input onChange={console.log} placeholder='请输入密码' />
                </Form.Item>
        
            </Form>
        </div>
    )
}

export default Index